<script setup>
import { ref } from 'vue';
import useStore from '../store';
// 定义初始任务名称
const taskname=ref('')
const {todos} = useStore()
const addTask =()=>{
  // 非空判断
  if (taskname.value.length===0) return
  todos.addTodo(taskname.value)
  //添加完成之后,清空内容
  taskname.value=''
}
</script>
<template>
  <header class="header">
    <h1>todos</h1>
    <input @keydown.enter.trim()="addTask" v-model="taskname" class="new-todo" placeholder="What needs to be done?" autofocus />
  </header>
</template>

<style lang="less" scoped></style>
